<template>
  <section>
    <p>
      <input id="msg" v-model.lazy="msg">
      <label for="msg">{{msg}}</label>
    </p>
    <p>
      <input id="number" type="number" v-model="age">
      <label for="number">{{age}}</label>
    </p>
    <p>
      <input id="trim" v-model.trim="trim">
      <label for="trim">{{trim}}</label>
    </p>
  </section>
</template>

<script>
export default {
  name: "ModelModifier",
  data() {
    return {
      msg: "",
      age: 26,
      trim: "    "
    };
  }
};
</script>